<template>
  <div id="Cart-compoent">
    <Nav>
      <template #middle>
        购物车({{ $store.state.cart_goods.length }})
      </template>
    </Nav>

    <Scroll class="wraper">
      <Item @istures="get_istures"></Item>
    </Scroll>

    <van-submit-bar
      :price="tatol_price * 100"
      button-text="提交订单"
      @submit="onSubmit"
    >
      <van-checkbox v-model="checked" @click.native="get_all"
        >全选</van-checkbox
      >
      <template #tip>
        你的收货地址不支持同城送,
        <span @click="onClickEditAddress">修改地址</span>
      </template>
    </van-submit-bar>
  </div>
</template>

<script>
import Nav from "@/components/header/Nav.vue"
import Scroll from "@/components/scroll/Scroll.vue"
import Item from "@/views/cart/cart_item/Item.vue"

import { get_tatol } from "@/views/cart/cart_item/tatolprice.js"

export default {
  name: "Cart",
  data() {
    return {
      //是否选中
      checked: true,
      //总价格
      tatol_price: 0,
    }
  },
  components: {
    Nav,
    Scroll,
    Item,
  },
  created() {},
  methods: {
    //提交栏
    onSubmit() {},
    //需改地址点击
    onClickEditAddress() {},
    //拿到是否为全选
    get_istures(fullture) {
      this.checked = fullture.istures
      this.tatol_price = fullture.price
    },
    //全选或全不选
    get_all() {
      this.checked = !this.checked
      this.$store.dispatch("all_checked", this.checked)

      let price = 0
      this.$store.state.cart_goods
        .filter((item) => item.ischebox != false)
        .map((item) => {
          return item.lowNowPrice * item.count
        }, 0)
        .forEach((item) => {
          price += item
        })
      this.tatol_price = price
    },
  },
}
</script>

<style lang="less" scoped>
.van-submit-bar {
  bottom: 46px;
}
.wraper {
  height: calc(100vh - 45px - 45px - 85px);
}
</style>
